﻿<style>
    /*评论*/
    .comment_box{border-top: 1px solid #CDE0EC;margin: 0 auto 20px;padding-top: 20px;font-size: 1em;font-family: "微软雅黑";}
    .comment_box h3{background: url("/images/sys/icon_comment.gif") no-repeat scroll left 8px transparent;border-bottom: 1px solid #999999;font-size: 16px;line-height: 30px;margin: 0 0 10px;padding: 0 0 0 20px;color: #555555;}
    .comment_box h3.add{background-position: left -43px;}
    .comment_box h3 span{float: right;font-size: 14px;font-weight: normal;}
    .comment_box h3 span a:hover{text-decoration: none;}
    .comment_list ul{list-style-type: none;}
    .comment_list ul li{border-bottom: 1px solid #E1E1E1;margin-bottom: 15px;margin-left: 0;}
    .comment_list ul li .title{background: url("/images/sys/icon_comment.gif") no-repeat scroll 0 -92px transparent;font-weight: bold;line-height: 30px; padding-left: 20px;}
    .comment_list ul li .title span{color: #999999;float: right;font-size: 12px;font-weight: normal;}
    .comment_list ul li .box{color: #333333;line-height: 1.8em;margin-bottom: 10px;}
    .comment_list ul li .reply{background: none repeat scroll 0 0 #F4EDDD;border: 1px solid #F0C59D;color: #FF6600;line-height: 1.5em;margin-bottom: 15px;padding: 3px 10px;}
    .comment_list ul li .reply .time{color: #999999;float: right;}
    .comment_add textarea{height: 80px;overflow: auto;width: 566px;}
    .comment_add .btns{margin-top: 10px;}
    .comment_add .btns .submit{float: right;}
    .comment_add .btns a{color: #868B6E;}
    .share{line-height: 18px;}
    .share a{font-family: "微软雅黑";}
    .blulink, .blulink a:link, .blulink a:visited{color: #164A84;text-decoration: none;}
    .blulink a:hover{color: #FF0000;text-decoration: none;}
    input.text, textarea.text{background: none repeat scroll 0 0 transparent;border: 1px solid #D5D6D3;font-family: "微软雅黑";font-size: 14px;padding: 4px 0 4px 10px;vertical-align: middle;}
    input.submit{background: none repeat scroll 0 0 orange; border: 1px solid #ccc;border-radius: 3px 3px 3px 3px;color: #FFFFFF;cursor: pointer;font-family: "微软雅黑";font-size: 14px;padding: 6px 10px;}
    .black{float:right;}
</style>
<script type="text/javascript">
    function AjaxPageList(listDiv, page) {
        jQuery.get("${config.web_path}tools/comment_list.aspx?r=" + Math.random() + "&cid=${channel.id}&pid=${model.id}&page=" + page, function (data) {
            jQuery(listDiv).html(data);
        });
    }
</script>
<script type="text/javascript">
    $(function () {
        //初始化评论列表
        AjaxPageList('#comment_list', 0);
    });
      </script>
<div class="comment_box">
  <h3> <span><a class="blulink" href="#Add">Has ${commentCount} comments, click on the comment</a></span>Latest Comments</h3>
  <div class="comment_list">
    <ul id="comment_list">
    </ul>
  </div>
  <!--放置页码-->
  <h3 class="add">  Leave a comment<a id="Add" name="Add"></a></h3>
  <script type="text/javascript">
        function addComment() {
            if (document.getElementById('txtContent').value.replace(/(^\s*)|(\s*$)/g, "") == '') {
                alert("Please enter comment！");
                return false;
            }
            if (document.getElementById('txtVerifyCode').value.replace(/(^\s*)|(\s*$)/g, "") == '') {
                alert("Please fill in the verification code！");
                return false;
            }
            document.getElementById("comment_form").submit();
        }
    </script>
  <form id="comment_form" action="/form.aspx?act=addComment" method="post">
    <input type="hidden" name="cid" value="${channel.id}" />
    <input type="hidden" name="pid" value="${model.id}" />
    <input type="hidden" name="title" value="${model.title}" />
    <div class="comment_add">
      <textarea id="txtContent" class="text required" name="txtContent"></textarea>
      <div class="btns">
        <input id="btnSubmit" class="submit" name="btnSubmit" value="SUBMIT" type="button"
                onclick="addComment()">
        <span>Captcha：</span>
        <input style="width: 80px;" id="txtVerifyCode" name="txtVerifyCode" class="text required"
                type="text">
        <img src="${config.web_path}tools/verify_code.ashx" style="margin-bottom: -6px; cursor: pointer" onclick="javascript:this.src='${config.web_path}tools/verify_code.ashx?r='+Math.random()" /> </div>
    </div>
  </form>
</div>
